<template>
  <div class="foot-service">
    <div class="item">
      <i class="iconfont icon-buoumaotubiao46"></i>
      <span>预约维修服务</span>
    </div>
    <div class="item">
      <i class="iconfont icon-7tiantuihuanhuo"></i>
      <span>7天无理由退货</span>
    </div>
    <div class="item">
      <i class="iconfont icon-15tianwuliyoutuihuo"></i>
      <span>15天免费换货</span>
    </div>
    <div class="item">
      <i class="iconfont icon-liwu"></i>
      <span>满69包邮</span>
    </div>
    <div class="item">
      <i class="iconfont icon-weizhi"></i>
      <span>520余家售后网点</span>
    </div>
  </div>
</template>

<script>
export default {
  name: "FooterService"
}
</script>

<style scoped lang="scss">
.foot-service {
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: #E0E0E0 1px solid;
  .item {
    width: 20%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    &:hover{
      i,span{
        color: #FF6700;
      }
    }
    &:after{
      position: absolute;
      right: 0;
      content: '';
      height: 70%;
      width: 1px;
      background:#E0E0E0 ;
    }
    &:last-child{
      &:after{
        background: transparent;
      }
    }
    i{
      font-size: 24px;
      color: #616161;
    }
    span{
      color: #616161;
      font-size: 16px;
      margin-left: 5px;
    }
  }
}
</style>